<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2017/11/28 0028
  Time: 上午 9:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>添加信用记录</title>
    <style>
        .layui-btn {
            position: relative;
            top:50px;
            left:100px;
        }
    </style>
    <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
</head>
<body>
<div class="box-padding-15">
    <%--<span class="layui-breadcrumb">--%>
    <%--<a href="#">首页</a>--%>
    <%--<a href="javascript:;">黑名单管理</a>--%>
    <%--<a><cite>增加</cite></a>--%>
    <%--</span>--%>

    <form class="layui-form" action="" method="get">

        <div class="layui-form-item">
            <label class="layui-form-label">手机号码:</label>
            <div class="layui-input-block">
                <input type="text" name="mobile" lay-verify="required|phone" placeholder="*首填项*  请输入11位手机号" autocomplete="off"
                       class="layui-input">
                <input type="hidden" name="clientId">
            </div>
        </div>
        <hr/>

        <div class="layui-form-item">
            <label class="layui-form-label">真实姓名:</label>
            <div class="layui-input-block">
                <input type="text" name="name" lay-verify="required" placeholder="真实姓名" autocomplete="off"
                       class="layui-input" disabled >
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">身份证号:</label>
            <div class="layui-input-block">
                <input type="text" name="idCard" lay-verify="required|identity" placeholder="身份证号" autocomplete="off"
                       class="layui-input" disabled >
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">已租车次数:</label>
            <div class="layui-input-block">
                <input type="text" name="rentCount" lay-verify="required|number" placeholder="租车次数" autocomplete="off"
                       class="layui-input" disabled >
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">信用值:</label>
            <div class="layui-input-block">
                <input type="text" name="creditNum" lay-verify="required|number" placeholder="当前信用值" autocomplete="off"
                       class="layui-input" disabled >
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">变化原因:</label>
            <div class="layui-input-block">
                <select name="changeReason" lay-verify="required"  lay-filter="reason">
                    <option value="">请选择</option>
                    <option value="正常租车">正常租车（+3）</option>
                    <option value="延期交车">延期交车（-2）</option>
                    <option value="车辆损坏">车辆损坏（-7）</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">信用变化值:</label>
            <div class="layui-input-block">
                <input type="text" name="creditChange" lay-verify="required|number" placeholder="信用变化值" autocomplete="off"
                       class="layui-input" disabled >
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo">保存</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

</div>

<script src="/static/plugins/jquery-3.2.1.min.js"></script>
<script src="/static/plugins/layui/layui.js"></script>
<script>
    layui.use(['element', 'form'], function () {
        var form = layui.form;
        var element = layui.element;

        //保存
        form.on("submit(formDemo)", function (data) {
            $.ajax({
                url: '/credit/saveAjax',
                data: data.field,
                type: 'get',
                dataType: 'json',
                success: function (msg) {
                    if (msg.code == 1) {
                        layer.msg(msg.message, {time: 1000, icon: 1}, function () {
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            parent.$("#tb_client").bootstrapTable("refresh"); // 刷新表格数据
                            parent.layer.close(index); //再执行关闭
                        })
                    }
                }
            })
            return false;
        })



        var $creditChange = $('input[name=creditChange]');
        //监听原因下拉框
        form.on('select(reason)', function(data){
            if(data.value==("正常租车")){
                $creditChange.val("+3");
            };
            if(data.value==("延期交车")){
                $creditChange.val("-2");
            };
            if(data.value==("车辆损坏")){
                $creditChange.val("-7");
            };
        });



        var $mobile = $('input[name=mobile]');
        var $name = $('input[name=name]');
        var $idCard = $('input[name=idCard]');
        var $creditNum = $('input[name=creditNum]');
        var $rentCount = $('input[name=rentCount]');
        var $clientId = $('input[name=clientId]');

        //监听手机输入框
        $mobile.bind("input propertychange", function (data) {
            var phone = $mobile.val();
            var length = phone.length;
            if(length==11){
                $.ajax({
                    url:"/credit/clientData",
                    type:'get',
                    data:{mobile:phone},
                    dataType:'json',
                    success:function (msg) {
                       var client = msg.data;
                        if(null!=client){
                            $name.val(client.name);
                            $idCard.val(client.idCard);
                            $creditNum.val(client.creditNum);
                            $rentCount.val(client.rentCount);
                            $clientId.val(client.id);
                        }else{
                            $name.val("");
                            $idCard.val("");
                            $creditNum.val("");
                            $rentCount.val("");
                        }
                        if(msg.code==1){
                            layer.msg(msg.message, {time: 2000, icon: 1});
                        }else{
                            layer.msg(msg.message, {time: 2000, icon: 2});
                        }
                    },
                    error:function () {
                        layer.msg("服务器忙，稍后再试")
                    }
                });
            }
        });

    });
</script>
</body>
</html>
